<template>
	<up-modal :show="showPublishModal" :confirm-text="$t('time.confirm')" :cancel-text="$t('time.cancel')" :title="$t('site.parameter.settings.publish.tips.title')"
		:content="$t('site.parameter.settings.publish.tips.content')" contentTextAlign="center" show-cancel-button
		@cancel="showPublishModal = false" @confirm="publishParams"></up-modal>

	<fixed-footer>
		<up-button type="primary" size="large" shape="circle"
			@tap="handlePublish">{{ btnLabel ||  $t('site.parameter.settings.publish.btn')}}</up-button>
	</fixed-footer>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	const {
		beforePublish
	} = defineProps({
		btnLabel: {
			type: String,
		},
		beforePublish: Function
	})
	const emits = defineEmits(['publish'])
	const showPublishModal = ref(false);
	const handlePublish = () => {
		if (typeof beforePublish === 'function') {
			if (!beforePublish()) {
				return;
			}
		}
		showPublishModal.value = true;
	}

	const publishParams = () => {
		showPublishModal.value = false;
		emits('publish');
	}
</script>

<style lang="scss">

</style>